<template>
	<div>
		<el-form :inline="true" :model="search" style="margin-top: 20px;">
			<el-form-item label="检测点名称:" label-width="120px">
				<el-input v-model="search.name" placeholder="请输入检测点名称"></el-input>
			</el-form-item>
			<el-form-item label="检测点地址" label-width="120px">
				<el-input v-model="search.address" placeholder="请输入检测点地址"></el-input>
			</el-form-item>
			<el-form-item label="状态" label-width="60px">
				<el-select v-model="search.status" placeholder="请选择状态">
					<el-option label="已过载" value="1"></el-option>
					<el-option label="未过载" value="0"></el-option>
				</el-select>
			</el-form-item>
			<el-form-item>
				<el-button type="primary" @click="cx">查询</el-button>
				<el-button type="primary" @click="cz">重置</el-button>
				<el-button type="primary" @click="xj">新建</el-button>
			</el-form-item>
		</el-form>
		<el-table :data="tableData" style="width: 100%" stripe highlight-current-row>
			<el-table-column label="编号" width="180" prop="id" align="center"></el-table-column>
			<el-table-column label="检测点名称" width="140" prop="name" align="center"></el-table-column>
			<el-table-column label="检测点地址" width="140" prop="address" align="center"></el-table-column>
			<el-table-column label="实时功率" width="140" prop="rtPower" align="center"></el-table-column>
			<el-table-column label="实时电压" width="140" prop="rtVoltage" align="center"></el-table-column>
			<el-table-column label="状态" width="140" align="center">
				<template slot-scope="scope">
					<span>{{scope.row.status==0?'未过载':'已过载'}}</span>
				</template>
			</el-table-column>
			<el-table-column label="上报时间" width="200" prop="createTime" align="center"></el-table-column>
			<el-table-column label="备注" width="180" prop="remark" align="center"></el-table-column>
			<el-table-column label="操作" align="center">
				<template slot-scope="scope">
					<el-button size="mini" @click="change(scope.row)">编辑</el-button>
					<el-button size="mini" type="danger" @click="remove(scope.row)">删除</el-button>
				</template>
			</el-table-column>
		</el-table>
		<el-dialog title="添加能效检测点" :visible.sync="addxs" width="30%">
			<el-form :model="addone" label-position="left" label-width="100px" :rules="rules" ref="formadd">
				<el-form-item label="检测点名称:" prop="name">
					<el-input v-model="addone.name" placeholder="请输入检测点名称"></el-input>
				</el-form-item>
				<el-form-item label="检测点地址:" prop="address">
					<el-input v-model="addone.address" placeholder="请输入检测点地址"></el-input>
				</el-form-item>
				<el-form-item label="实时功率:" prop="rtPower">
					<el-input v-model="addone.rtPower" placeholder="请输入实时功率"></el-input>
				</el-form-item>
				<el-form-item label="实时电压:" prop="rtVoltage">
					<el-input v-model="addone.rtVoltage" placeholder="请输入实时电压"></el-input>
				</el-form-item>
				<el-form-item label="状态:" prop="status">
					<el-select v-model="addone.status" placeholder="请选择状态">
						<el-option label="已过载" value="1"></el-option>
						<el-option label="未过载" value="0"></el-option>
					</el-select>
				</el-form-item>
			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button @click="addqx">取 消</el-button>
				<el-button type="primary" @click="addqd">确 定</el-button>
			</div>
		</el-dialog>

		<el-dialog title="修改能效检测点" :visible.sync="updatexs" width="30%">
			<el-form :model="xgone" label-position="left" label-width="100px" :rules="rules" ref="formupdate">
				<el-form-item label="检测点名称:" prop="name">
					<el-input v-model="xgone.name" placeholder="请输入检测点名称"></el-input>
				</el-form-item>
				<el-form-item label="检测点地址:" prop="address">
					<el-input v-model="xgone.address" placeholder="请输入检测点地址"></el-input>
				</el-form-item>
				<el-form-item label="实时功率:" prop="rtPower">
					<el-input v-model="xgone.rtPower" placeholder="请输入实时功率"></el-input>
				</el-form-item>
				<el-form-item label="实时电压:" prop="rtVoltage">
					<el-input v-model="xgone.rtVoltage" placeholder="请输入实时电压"></el-input>
				</el-form-item>
				<el-form-item label="状态:" prop="status">
					<el-select v-model="xgone.status" placeholder="请选择状态">
						<el-option label="已过载" value="1"></el-option>
						<el-option label="未过载" value="0"></el-option>
					</el-select>
				</el-form-item>
				<el-form-item label="备注:" prop="remark">
					<el-input v-model="xgone.remark" placeholder="请输入备注"></el-input>
				</el-form-item>
			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button @click="updateqx">取 消</el-button>
				<el-button type="primary" @click="updateqd">确 定</el-button>
			</div>
		</el-dialog>
	</div>
</template>

<script>
	import {
		nxyjlist,nxyjsc,nxyjadd,nxyjxg
	} from '@/api/rw.js'
	export default {
		data() {
			return {
				search: {},
				addxs: false,
				updatexs: false,
				addone: {},
				xgone: {},
				rules: {
					name: [{
						required: true,
						message: '请输入活动名称',
						trigger: 'blur'
					}],
					address: [{
						required: true,
						message: '请输入监测点地址',
						trigger: 'blur'
					}],
					rtPower: [{
						required: true,
						message: '不能为空'
					}],
					rtVoltage: [{
						required: true,
						message: '不能为空'
					}],
					status: [{
						required: true,
						message: '不能为空'
					}],
				},
				tableData: []
			}
		},
		methods: {
			async select(data) {
				let r = await nxyjlist(data)
				console.log(r);
				this.tableData = r.data.reverse()
			},
			async change(i) {
				this.updatexs = true
				let r = await nxyjlist({
					id: i.id
				})
				this.xgone = r.data[0]
			},
			async remove(i) {
				let id = i.id
				let r = await nxyjsc({
					id: id
				})
				console.log(r);
				this.$alert("删除成功", "提示", {
					confirmButtonText: '确定'
				})
				this.select()
			},
			async cx() {
				console.log(this.search);
				this.select(this.search)
			},
			async cz() {
				this.search = {}
				this.select()
			},
			xj() {
				this.addxs = true
			},
			addqd() {
				this.$refs.formadd.validate(async (a) => {
					if (a) {
						let r = await nxyjadd(this.addone)
						this.select()
						this.addxs = false
						this.addone = {}
						this.$alert("添加成功", "提示", {
							confirmButtonText: "确定"
						})
					}
				})
			},
			addqx() {
				this.addxs = false
				this.addone = {}
			},
			updateqx() {
				this.updatexs = false
				this.xgone = {}
			},
			updateqd() {
				this.$refs.formupdate.validate(async (a) => {
					if (a) {
						let r = await nxyjxg(this.xgone)
						this.select()
						this.updatexs = false
						this.xgone = {}
						this.$alert("修改成功", "提示", {
							confirmButtonText: "确定"
						})
					}
				})
			}
		},
		async mounted() {
			this.select()
		}
	}
</script>

<style>
</style>
